<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test.js"></script>
<script src="../resources/common.js"></script>
</head>
<body>

<select id=select1 size=3>
<option selected>a</option>
<option>b</option>
<option>c</option>
</select>

<select id=select2>
<option selected>a</option>
<option>b</option>
<option>c</option>
</select>

<select id=select3>
<option selected>a</option>
</select>

<select id=select4>
<option selected>a</option>
<option>b</option>
<option>c</option>
</select>

<input id="text"></input>

<script>
description('Tests that user cannot change disabled select by keyboard');
jsTestIsAsync = true;

var select1 = document.getElementById('select1');
select1.focus();
shouldBeEqualToString('select1.value', 'a');
eventSender.keyDown('ArrowDown');
shouldBeEqualToString('select1.value', 'b');
select1.disabled = true;
eventSender.keyDown('ArrowDown');
shouldBeEqualToString('select1.value', 'b');
eventSender.keyDown('c');
shouldBeEqualToString('select1.value', 'b');

var select2 = document.getElementById('select2');
select2.focus();
shouldBeEqualToString('select2.value', 'a');
eventSender.keyDown('b');
shouldBeEqualToString('select2.value', 'b');
select2.disabled = true;
eventSender.keyDown('ArrowDown');
shouldBeEqualToString('select2.value', 'b');
eventSender.keyDown('c');
shouldBeEqualToString('select2.value', 'b');

debug('Tests on select disable, popup menu is hidden');
var select3 = document.getElementById('select3');
clickElement(select3);
shouldBeTrue("internals.isSelectPopupVisible(select3)");
select3.disabled = true;
select3.offsetLeft;
setTimeout(() => {
  shouldBeFalse("internals.isSelectPopupVisible(select3)");

  debug('Tests on select disable, value cannot be changed');
  var select4 = document.getElementById('select4');
  select4.focus();
  eventSender.keyDown('b');
  shouldBeEqualToString('select4.value', 'b');
  select4.disabled = true;
  eventSender.keyDown('c');
  shouldBeEqualToString('select4.value', 'b');
  finishJSTest();
}, 0);
</script>
</body>
</html>
